import React, { memo, useEffect, useState, useRef, Component } from "react";
import Taro, { navigateBack } from '@tarojs/taro';
import { View, Text } from '@tarojs/components';


import { Button } from '@antmjs/vantui'
import { getPersonalCertiInfo } from '@/services/api/user';
import { createAuth } from '@/services/index'
import PdsField from "@/components/common/pds_field/index";
import './index.scss'



class RealName extends Component {

  config = {
    navigationBarTitleText: ''
  }

  state = {
    name: '',
    credCode: '',
    currentType: 1,
    userInfo: JSON.parse(Taro.getStorageSync('user-info'))
  }

  componentWillMount() {
    this.requestPersonalCertiInfo();
  }
  componentDidMount() {

  }
  componentWillReceiveProps(nextProps, nextContext) { }
  componentWillUnmount() { }

  /**
   * 获取实名信息
   */
  requestPersonalCertiInfo() {
    getPersonalCertiInfo(0).then((resp) => {
      if (resp.code === 200) {
        this.setState({ name: resp.data['name'], credCode: resp.data['credCode'] });
      }
    })
  }
  setCurrentType = (index) => {
    this.setState({
      currentType: index
    })
  }
  // 提交
  submit() {
    const { credCode, name, currentType } = this.state
    let params = {
      name: name,
      cred_type: 1,
      cred_code: credCode,
      certificate_validity: -1,
      investorClass: currentType
    }
    createAuth(params).then(resp => {
      if (resp.code === 200) {
        Taro.navigateBack();
      }
    })
  }


  render() {
    const { credCode, name, currentType, userInfo } = this.state
    let hasType = userInfo.userRisk?.investorClass ? userInfo.userRisk?.investorClass : '-1'
    let authCertiStatus = userInfo.userRisk?.authCertiStatus ? userInfo.userRisk?.authCertiStatus : '1'


    return (
      <View className='page'>
        {
          authCertiStatus != 3 ?
            <>
              <PdsField className='top' name='姓名' data={name} placeholder='请输入名称' onChange={(e) => {
                this.setState({ name: e })
              }}
              ></PdsField>
              <PdsField name='证件号码' data={credCode} placeholder='请输入证件号码' onChange={(e) => {
                this.setState({ credCode: e })
              }}
              ></PdsField>
            </>
            :
            null
        }
        {
          hasType != '1' && hasType != '2' ?
            <>
              <View className='pds-field'>
                <Text>投资者类型</Text>
                <View className='investor-type'>
                  <View className={`${currentType === 1 ? 'is-active' : ''}`} onClick={() => this.setCurrentType(1)} >普通投资者</View>
                  <View className={`${currentType === 2 ? 'is-active' : ''}`} onClick={() => this.setCurrentType(2)}>专业投资者</View>
                </View>
              </View>
            </>
            :
            null
        }
        <Button onClick={() => this.submit()}>确定</Button>
      </View >
    );
  }
}
export default RealName;

